<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!--bootstrap插件-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <link href="/static/plugin/bootstrap/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet"/>
    <link href="/static/plugin/jo/joUI.css" rel="stylesheet"/>
    <!--字体插件-->
    <link href="/static/plugin/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
    <link href="/static/plugin/layui-2.4.3/css/layui.css" rel="stylesheet"/>
    <!--ztree-->
    <link href="/static/plugin/zTree/css/metroStyle/metroStyle.css" rel="stylesheet"/>
    <!--common-->
    <link href="/static/css/common.css" rel="stylesheet"/>
    <title>${model.tableRemark!}视图</title>
</head>
<body class="skin-default">

<div class="container-fluid">
    <div class="row">
        <div class="col-xs-12">
            <!--视图块-->
            <div class="container-fluid card">
                <div class="row">
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                        <!--检索栏-->
                        <form class="form-inline search-bar" id="pageForm">
                        <#list model.colList as item>
                            <#if item.asCondition != "1">
                            <div class="form-group">
                                <label class="control-label">${item.fieldRemark}：&nbsp;</label>
                                <#if item.controlType == "input">
                                <input type="text" name="${item.attrName}" class="form-control">
                                <#elseif item.controlType == "joInput">
                                <input type="text" name="${item.attrName}" id="${item.attrName}" class="joInput form-control">
                                <#elseif item.controlType == "date">
                                <div class="input-group">
                                    <input type="text" name="${item.attrName}" id="${item.attrName}" class="form-control">
                                    <span class="input-group-addon" style="border-width: 1px 0px;">~</span>
                                    <input type="text" name="${item.attrName}2" id="${item.attrName}2" class="form-control">
                                </div>
                                <#elseif item.controlType == "select">
                                <select name="${item.attrName}" class="form-control">
                                    <option value=""></option>
                                <#if item.controlParam?? && item.controlParam != "">
                                <#list item.controlParam?split(",") as option>
                                    <#assign idx="${option?index_of(':')}"/>
                                    <option value="${option?substring(0, idx?number)}">${option?substring(idx?number+1)}</option>
                                </#list>
                                </#if>
                                </select>
                                <#elseif item.controlType == "joSelect">
                                <select name="${item.attrName}" class="joSelect form-control" data="" dataurl="${item.controlParam}" keyfield="id" valuefield="name" firstitem='{"id":"","name":""}'></select>
                                <#elseif item.controlType == "checkbox">
                                <input type="text" name="${item.attrName}" class="form-control">
                                <#elseif item.controlType == "radio">
                                <input type="text" name="${item.attrName}" class="form-control">
                                <#elseif item.controlType == "textarea">
                                <textarea name="${item.attrName}" class="form-control"></textarea>
                                <#elseif item.controlType == "tree">
                                <input type="text" name="${item.attrName}" class="form-control">
                                <#elseif item.controlType == "trees">
                                <input type="text" name="${item.attrName}" class="form-control">
                                <#elseif item.controlType == "list">
                                <input type="text" name="${item.attrName}" class="form-control">
                                <#elseif item.controlType == "lists">
                                <input type="text" name="${item.attrName}" class="form-control">
                                </#if>
                            </div>
                            </#if>
                        </#list>
                            <button type="button" class="btn btn-primary" onclick="joView.select()"> <i class="fa fa-search" aria-hidden="true"></i>&nbsp;查询</button>
                        </form>
                        <!--/检索栏-->
                    </div>
                </div>
                <div class="row">
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                        <!--按钮栏-->
                        <div class="form-group button-bar">
                            <button isShow="" type="button" class="btn btn-primary" onclick="joView.add()">
                                <i class="fa fa-plus" aria-hidden="true"></i>&nbsp;新增
                            </button>
                            <button type="button" class="btn btn-danger" onclick="joView.del()">
                                <i class="fa fa-trash-o" aria-hidden="true"></i>&nbsp;删除
                            </button>
                            <button type="button" class="btn btn-warning" onclick="window.location.reload()">
                                <i class="fa fa-refresh" aria-hidden="true"></i>&nbsp;刷新
                            </button>
                        </div>
                        <!--/按钮栏-->
                    </div>
                </div>
                <div class="row">
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                        <div class="table-bar">
                            <!--grid-->
                            <div class="table-responsive">
                                <table class="table table-bordered table-hover" id="mainList" dataUrl="${model.webDomain!}${model.moduleName}/${model.className?uncap_first}/getPage" deleteUrl="${model.webDomain!}${model.moduleName}/${model.className?uncap_first}/delete" formUrl="/page/${model.moduleName}/${model.className?uncap_first}Form.html">
                                <#--定义临时变量temp_temp,用来表示第N个viewShow=1的字段配置,方便添加click事件-->
                        <#assign temp_idx = 0>
                        <#list model.colList as item>
                            <#if item.viewShow == "1">
                                <#assign temp_idx = temp_idx + 1>
                                <#if item.fieldType=="Date">
                                    <col field="[=jo.formatTime('{${item.attrName}}')]" title="${item.fieldRemark!item.attrName}" width="15%" align="" <#if temp_idx == 1>event="click"</#if> <#if item.supportSort == "1">order="${item.attrName}"</#if>/>
                                <#else>
                                    <col field="${item.attrName}" title="${item.fieldRemark!item.attrName}" width="15%" align="" <#if temp_idx == 1>event="click"</#if> <#if item.supportSort == "1">order="${item.attrName}"</#if>/>
                                </#if>
                            </#if>
                        </#list>
                                </table>
                            </div>
                            <!--/grid-->

                            <!--分页条-->
                            <div class="page-bar" gridId="mainList">

                            </div>
                            <!--/分页条-->
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>

<!--配置信息-->
<script src="/static/js/config.js"></script>
<!--jquery-->
<script src="/static/plugin/jquery/jquery-3.3.1.js"></script>
<script src="/static/plugin/jquery/jquery.cookie.js"></script>
<!--bootstrap-->
<script src="/static/plugin/bootstrap/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<!--[if lt IE 9]>
<script src="/static/plugin/other/html5shiv.js"></script>
<script src="/static/plugin/other/respond.min.js"></script>
<![endif]-->
<!--layui-->
<script src="/static/plugin/layui-2.4.3/layui.all.js"></script>
<!--ztree-->
<script src="/static/plugin/zTree/js/jquery.ztree.all.js"></script>
<!--common-->
<script src="/static/js/common.js"></script>
<!--jo-->
<script src="/static/plugin/jo/jo.js"></script>
<script src="/static/plugin/jo/jo-adapt.js"></script>
<script src="/static/plugin/jo/jo-page-view.js"></script>
<script src="/static/plugin/jo/jo-page-form.js"></script>
<script src="/static/plugin/jo/jo-listener.js"></script>
<script type="text/javascript">
<#list model.colList as item>
    <#if item.controlType == "date">
    layui.laydate.render({
        elem: '#${item.attrName}' //注册日期控件
    });
    layui.laydate.render({
        elem: '#${item.attrName}2' //注册日期控件
    });
    <#elseif item.controlType == "joInput">
    JoInputSimple('${item.attrName}', '${item.controlParam!}');//初始化输入选择框
    </#if>
</#list>
    $(function(){
        joView.init({grid:$("#mainList"),PKName:"id"});//初始化页面
    });
    //表格渲染时行处理,参数1为当前行的数据对象,参数2为当前行的索引值(最小为0)
    joView.handleItem = function(oItem,iIndex){

    };
    //表格渲染完成后的回调,参数为表格数据(数组对象)
    joView.setGridDataAfter = function(oList){

    };
    /* 关于joView更多回调函数和配置参数可查看jo-page-view.js */
</script>
</body>
</html>
